<!DOCTYPE html>
<html>

<head>

    <meta charset="utf-8"/>
    <link href="static/css/bootstrap/bootstrap.min.css" rel="stylesheet"/>
    <link href="static/css/other/font-awesome.min.css" rel="stylesheet"/>
    <link href="static/css/other/style.min.css?v=4.1.0" rel="stylesheet"/>
    <link href="static/css/plugins/dateTables/dataTables.bootstrap.css" rel="stylesheet"/>
    <link href="static/css/order/order.css" rel="stylesheet"/>
</head>

<body>

<div class="gray-bg">
    <div class=" dashboard-header top-bar">
        <div class="col-lg-8 row overview">
            <div class="col-sm-2 ">
                <strong>订单状态统计</strong>
            </div>
            <div class="col-sm-2 starting">
                <h><i class="fa fa-circle staring"></i> 设备启动中
                    <h>1</h>
                </h>
            </div>
            <div class="col-sm-2">
                <h><i class="fa fa-circle startfailed"></i> 启动失败
                    <h>2</h>
                </h>
            </div>
            <div class="col-sm-2">
                <h><i class="fa fa-circle charging"></i> 充电中
                    <h>3</h>
                </h>
            </div>
            <div class="col-sm-2">
                <h><i class="fa fa-circle createOrder"></i> 生成订单中
                    <h>4</h>
                </h>
            </div>
            <div class="col-sm-2">
                <h><i class="fa fa-circle chargefailed"></i> 充电失败
                    <h>5</h>
                </h>
            </div>

        </div>

    </div>


    <div class="wrapper wrapper-content ">
        <div class=" row ibox">
            <div class="ibox-title  float-e-margins">
                <h5>订单状态
                </h5>
            </div>
            <div class="ibox-content border-bottom">
                <div class="row">
                    <div class="col-sm-2">
                        <div class="form-group">
                            <input type="text" id="order_id" name="order_id" value="" placeholder="充电站"
                                   class="form-control"/>
                        </div>
                    </div>
                    <div class="col-sm-2">
                        <div class="form-group">
                            <input type="text" id="chargingStation" name="status" value="" placeholder="充电桩"
                                   class="form-control"/>
                        </div>
                    </div>
                    <div class="col-sm-2">
                        <div class="form-group">
                            <input type="text" id="status" name="customer" value="" placeholder="状态"
                                   class="form-control"/>
                        </div>
                    </div>

                    <div class="col-sm-2">
                        <div class="form-group">
                            <input type="text" id="orderId" name="customer" value="" placeholder="订单号"
                                   class="form-control"/>
                        </div>
                    </div>
                    <div class="col-sm-2">
                        <div class="form-group">
                            <input type="text" id="customer" name="customer" value="" placeholder="用户"
                                   class="form-control"/>
                        </div>
                    </div>
                </div>

                <div class="row">
                    <div class="col-sm-4">
                        <div class="input-group date">
                            <input id="datepick" class="form-control" placeholder="选择时间"
                                   onclick="laydate({istime: true, format: 'YYYY-MM-DD hh:mm:ss'})"/>
                            <span class="input-group-addon"><i class="fa fa-calendar"
                                                               style="color:rgba(27,187,158,1)"></i></span>
                        </div>
                    </div>
                    <div class="col-sm-4">
                        <div class="form-group">
                            <div class="row">
                                <div class="col-sm-3">
                                    <label type="button" class="btn-sm btn-primary">查询</label>
                                </div>
                                <div class="col-sm-3">
                                    <label type="button" class="btn btn-sm btn-default  btn-block">重置</label>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="ibox-content">
                <table class="table table-striped table-bordered table-condensed">
                    <thead >
                    <tr id ="title">

                        <th>序号</th>
                        <th>订单号</th>
                        <th>运营商</th>
                        <th>充电站</th>
                        <th>充电桩</th>
                        <th>用户</th>
                        <th>订单状态</th>
                        <th>日志</th>
                        <th>充电桩实时状态</th>

                    </tr>
                    </thead>
                    <tbody id="list">
                    <tr>
                        <td>
                            01
                        </td>
                        <td>
                            2018111201
                        </td>
                        <td>
                            科佳同创
                        </td>
                        <td>
                            交大充电站
                        </td>
                        <td>
                            1#直流充电桩
                        </td>
                        <td>
                            <img alt="image" class="img-circle" src="static/images/head.png"/>
                            18813051694
                        </td>
                        <td>
                            <i class="fa fa-circle" style="color: gray"></i> 启动失败
                        </td>
                        <td>
                            <label class="btn-link link">查看</label>
                        </td>
                        <td>
                            <label class="btn-link link">充电桩实施状态</label>
                        </td>
                    </tr>
                    <tr>
                        <td>
                            01
                        </td>
                        <td>
                            2018111201
                        </td>
                        <td>
                            科佳同创
                        </td>
                        <td>
                            交大充电站
                        </td>
                        <td>
                            1#直流充电桩
                        </td>
                        <td>
                            <img alt="image" class="img-circle" src="static/images/head.png"/>
                            18813051694
                        </td>
                        <td>
                            <i class="fa fa-circle" style="color: gray"></i> 启动失败
                        </td>
                        <td>
                            <a class="btn-link link">查看</a>
                        </td>
                        <td>
                            <a class="btn-link link">充电桩实施状态</a>
                        </td>
                    </tr>
                    <tr>
                        <td>
                            01
                        </td>
                        <td>
                            2018111201
                        </td>
                        <td>
                            科佳同创
                        </td>
                        <td>
                            交大充电站
                        </td>
                        <td>
                            1#直流充电桩
                        </td>
                        <td>
                            <img alt="image" class="img-circle" src="static/images/head.png"/>
                            18813051694
                        </td>
                        <td>
                            <i class="fa fa-circle" style="color: gray"></i> 启动失败
                        </td>
                        <td>
                            <label class="btn-link link">查看</label>
                        </td>
                        <td>
                            <label class="btn-link link">充电桩实施状态</label>
                        </td>
                    </tr>

                    </tbody>
                </table>
            </div>
        </div>
    </div>
</div>


<script src="static/js/bootstrap/bootstrap-table-zh-CN.min.js"></script>
<script src="static/js/bootstrap/bootstrap-table.js"></script>
<script src="static/js/jquery-2.1.1.js"></script>
<script src="static/js/bootstrap.min.js"></script>
<script src="static/js/plugins/slimscroll/jquery.slimscroll.min.js"></script>
<script src="static/js/inspinia.js"></script>
<script src="static/js/order/order.js"></script>
<script src="static/js/other/laydate/laydate.js"></script>


</body>

</html>
